<template>
    <div>
        <h1>{{ $store.state.name }}</h1>
        <h1>{{ state.name }}</h1>

        <button @click="add">点击增加</button>
        <h1>number:{{ number }}</h1>
        <h1>Count:{{ state.count }}</h1>
         </div>
</template>

<script>
import { ref } from "vue";
import { useStore } from "vuex";

export default {
    name: 'Count',
    props: {
    },
    setup() {
        const store = useStore();
        const state = ref(store.state);
        const number = ref(0)
        const add = function () {
            number.value++;
            store.commit('increment')
        }
        return { state, number, add }
    }
}
</script>

<style></style>